import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'package:get/get.dart';
import 'package:gluz/app/common/common_button.dart';
import 'package:gluz/app/modules/login/register/controllers/register_controller.dart';
import 'package:keyboard_actions/keyboard_actions.dart';

import '../../../../../app_session.dart';
import '../../../../utils/colors.dart';


class RegisterView extends GetView<RegisterController> {
  const RegisterView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: AppBar(
        backgroundColor: Colors.transparent,
      ),
      body: GetBuilder<RegisterController>(
          builder: (controller) {
            return Stack(
              fit: StackFit.expand,
              children: [
                Positioned(
                  top: 0,
                  left: 0,
                  right: 0,
                  child: Image.asset('assets/images/login_top_gradient.png', fit: BoxFit.fitWidth,),
                ),
                SafeArea(
                  child: SingleChildScrollView(
                    padding: EdgeInsets.symmetric(horizontal: 20),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const SizedBox(height: 20,),
                        Text('注册GULZ'.tr, style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),),
                        const SizedBox(height: 20,),
                        _buildLanguageSelector(),
                        const SizedBox(height: 20,),
                        _buildPhoneInput(),
                        _buildPasswordInput(),
                        if (controller.loginController.selectedCountry.id == 0)
                          _buildVerifyInput(),
                        _buildInviteInput(),
                        const SizedBox(height: 20,),
                        _buildAgreementCheckbox(),
                        const SizedBox(height: 20,),
                        _buildLoginButton(),
                        const SizedBox(height: 20,),
                        _buildRegisterLink(),

                      ],
                    ),
                  ),
                ),
              ],
            );
          }
      ),
    );
  }

  /// 构建语言选择按钮区域
  Widget _buildLanguageSelector() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        SizedBox(
          height: 24,
          width: 75,
          child: app.isLangRU() ? GLOutLineButton(
              onPressed: controller.onChineseLanguageSelected,
              child: Text('中文'.tr, style: TextStyle(color: AppColors.color_8C8C8C, fontSize: 13),)
          ) : GLGradientButton(
              onPressed: controller.onChineseLanguageSelected,
              child: Text('中文'.tr, style: TextStyle(color: Colors.white, fontSize: 13),)
          ),
        ),
        const SizedBox(width: 10),
        SizedBox(
          height: 24,
          width: 75,
          child: app.isLangRU() ? GLGradientButton(
              onPressed: controller.onRussianLanguageSelected,
              child: Text('RU'.tr, style: TextStyle(color: Colors.white, fontSize: 13),)
          ) : GLOutLineButton(
              onPressed: controller.onRussianLanguageSelected,
              child: Text('RU'.tr, style: TextStyle(color: AppColors.color_8C8C8C, fontSize: 13),)
          ),
        ),
      ],
    );
  }

  /// 构建手机号输入框
  Widget _buildPhoneInput() {
    return TextField(
      controller: controller.phoneController,
      keyboardType: TextInputType.phone,
      cursorColor: AppColors.color_278AFF,
      decoration: InputDecoration(
        prefixIcon: InkWell(
          onTap: controller.onTapCountry,
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: [
              SizedBox(
                width: 20,
                height: 13,
                child: Image.asset(controller.loginController.selectedCountry.image),
              ),
              SizedBox(width: 3),
              Text('+${controller.loginController.selectedCountry.code}', style: TextStyle(fontSize: 14),),
              Icon(Icons.keyboard_arrow_down_rounded, color: Colors.black,),
            ],
          ),
        ),
        hintText: '请输入手机号'.tr,
        hintStyle: TextStyle(color: AppColors.color_D8D8D8, fontSize: 14),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
      ),
    );
  }

  /// 构建密码输入框
  Widget _buildPasswordInput() {
    return TextField(
      controller: controller.pwdController,
      obscureText: true,
      keyboardType: TextInputType.visiblePassword,
      cursorColor: AppColors.color_278AFF,
      decoration: InputDecoration(
        prefixIcon: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('设置密码'.tr, style: TextStyle(fontSize: 15),),
            SizedBox(width: 3),
          ],
        ),
        hintText: '请输入密码'.tr,
        hintStyle: TextStyle(color: AppColors.color_D8D8D8, fontSize: 14),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
      ),
    );
  }

  /// 构建验证码输入框
  Widget _buildVerifyInput() {
    return TextField(
      controller: controller.verifyController,
      keyboardType: TextInputType.number,
      cursorColor: AppColors.color_278AFF,
      decoration: InputDecoration(
        prefixIcon: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('验证码'.tr, style: TextStyle(fontSize: 15),),
            SizedBox(width: 3),
          ],
        ),
        suffixIcon: InkWell(
          onTap: controller.onTapVerify,
          child: Container(
            alignment: Alignment.centerRight,
            width: 80,
            child: Text(controller.verifyText,style: TextStyle(color: AppColors.color_8C8C8C), textAlign: TextAlign.end,),
          ),
        ),
        hintText: '请输入短信验证码'.tr,
        hintStyle: TextStyle(color: AppColors.color_D8D8D8, fontSize: 14),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
      ),
    );
  }

  /// 构建邀请码输入框
  Widget _buildInviteInput() {
    return TextField(
      controller: controller.inviteController,
      keyboardType: TextInputType.number,
      cursorColor: AppColors.color_278AFF,
      decoration: InputDecoration(
        prefixIcon: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('邀请码'.tr, style: TextStyle(fontSize: 15),),
            SizedBox(width: 3),
          ],
        ),
        suffixIcon: SizedBox(
          width: 40,
          child: Center(child: Text('非必填'.tr,style: TextStyle(color: AppColors.color_278AFF),)),
        ),
        hintText: '请输入邀请码'.tr,
        hintStyle: TextStyle(color: AppColors.color_D8D8D8, fontSize: 14),
        enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
        focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: AppColors.color_D8D8D8, width: 0.5)
        ),
      ),
    );
  }


  /// 构建同意协议复选框
  Widget _buildAgreementCheckbox() {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Transform.scale(
          scale: 0.8,
          child: SizedBox(
            width: 18,
            height: 18,
            child: Checkbox(
              activeColor: AppColors.color_278AFF,
              value: controller.isCheckLink,
              onChanged: (value) {
                controller.isCheckLink = !controller.isCheckLink;
                controller.update();
              },
            ),
          ),
        ),
        SizedBox(width: 5,),
        Expanded(
          child: RichText(
            text: TextSpan(
              text: '阅读并同意'.tr,
              style: TextStyle(color: Colors.black, fontSize: 12),
              children: [
                TextSpan(
                  text: '《GULZ用户服务协议和隐私政策》'.tr,
                  style: TextStyle(color: AppColors.color_16C186),
                  recognizer: TapGestureRecognizer()
                    ..onTap = controller.onUserAgreementTapped,
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }


  /// 构建登录按钮
  Widget _buildLoginButton() {
    return GLGradientButton(
        onPressed: controller.onRegisterButtonPressed,
        child: Text('注册'.tr, style: TextStyle(
            color: Colors.white,
            fontSize: 16,
            fontWeight: FontWeight.bold
        ),)
    );
  }

  /// 构建注册链接
  Widget _buildRegisterLink() {
    return Center(
      child: RichText(
        text: TextSpan(
          text: '若您长时间未收到短信验证码可'.tr,
          style: TextStyle(color: Colors.black),
          children: [
            TextSpan(
              text: '联系客服'.tr,
              style: TextStyle(
                color: AppColors.color_278AFF,
              ),
              recognizer: TapGestureRecognizer()
                ..onTap = controller.onServerTap,
            ),
          ],
        ),
      ),
    );
  }
}
